<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登陆</title>
</head>
<body>
<div class="row">
    <div class="col-xs-6 pull_left">
        <div class="form-group">
            <input class="form-control" type="tel" id="verify_input" placeholder="请输入验证码" maxlength="4">
        </div>
    </div>
    <div class="col-xs-6 pull_left">
        <a href="javascript:void(0);" title="点击更换验证码">
            <img id="imgVerify" src="login/getVerify" alt="更换验证码" height="36" width="170" onclick="getVerify(this);">
        </a>
    </div>
    <input type="button" onclick="aVerify()" value="提交">
</div>
</body>
<script type="text/javascript" src="./js/jquery.min.js"></script>
<script>

    //获取验证码
    /*function getVerify(obj){
        obj.src =  "login/getVerify?"+Math.random();//原生js方式
    }*/

    function getVerify() {
        // $("#imgCode").on("click", function() {
        $("#imgVerify").attr("src", 'login/getVerify?' + Math.random());//jquery方式
        // });
    }

    function aVerify(){
        var value =$("#verify_input").val();
        // alert(value);
        $.ajax({
            async: false,
            type: 'post',
            url: 'login/checkVerify',
            dataType: "json",
            data: {
                verifyInput: value
            },
            success: function (result) {
                if (result) {
                    alert("success!");
                } else {
                    alert("failed!");
                }
                // window.location.reload();
                getVerify();
            }
        });
    }


</script>
</html>